import React, { Component } from "react";
import { connect } from "react-redux";

class App extends Component {
  render() {
    const { value, dispatch } = this.props;
    return (
      <div>
        <h1>
          {value}{" "}
          <button
            type="button"
            onClick={() => dispatch({ type: "ADD" })}
            className="btn btn-primary"
          >
            +
          </button>{" "}
          <button
            type="button"
            onClick={() => dispatch({ type: "DEL" })}
            className="btn btn-primary"
          >
            -
          </button>
        </h1>
      </div>
    );
  }
}

const mapStateToProps = (state, ownProps) => {
  console.info("state", state);
  console.info("ownProps", state);
  return { value: state.value };
};

export default connect(mapStateToProps)(App);
